.float-button {
  position: relative;
  width: $size;
  height: $size;
  border-radius: 100%;
  background-image: linear-gradient(45deg, #52ffaf, #2196f3);
  box-shadow: 0 1px 2px 1px rgba(0, 0, 0, 0.2);

  &::before,
  &::after {
    content: "";
    position: absolute;
    left: 50%;
    -webkit-margin-top-collapse: 0;
    display: block;
    margin-left: -9px;
    border-radius: 3px;
    width: 18px;
    height: 3px;
    background: #ffffff;
    transition: all 200ms ease;
  }

  &::before {
    transform: translateY(12px);
    filter: drop-shadow(0 6px 0 white);
  }
  &::after {
    transform: translateY(24px);
  }
  &:hover {
    &::before {
      filter: none;
      transform: translateY(18px) rotate(-45deg);
    }
    &::after {
      transform: translateY(18px) rotate(45deg);
    }
  }
}
